<template>
  <el-card shadow="never" class="main">
    <div slot="header" style="padding:0px 10px">
      <el-row class="clearfix">
        <el-col :span='6'><span class="tittle"><slot name="tittle"></slot></span></el-col>
        <el-col :span='6' :offset="12" class="more"><el-link type='info' @click="GoMore">更多...</el-link></el-col>
      </el-row>
    </div>
    <div class="item" v-for="(item,index) in dataList">
      <el-link :underline="false" @click="GoOneNotice(item)" class="linkcontent">{{item.NoticeTittle}}</el-link>
      <span class="spancontent">{{handleDate(item.date)}}</span>
    </div>
  </el-card>
</template>


<script>
export default {
  name: 'InfoTp',
  props:[
    'dataForm',
  ],
  data () {
    return {
      dataList: '',
    }
  },
  methods: {
    // 更多... 即所有通知公告
    GoMore(){
      this.$router.push({
        path:'AllMoreTp',
        query: this.dataForm,
      });
    },
    // 跳转到具体的一条通知
    GoOneNotice(item){
      this.$router.push({
        path: 'OneNoticeTp',
        query: {
          NoticeTittle: item.NoticeTittle,
          source: item.source,
          hits: item.hits,
          keywords: item.keywords,
          date: item.date,
          NoticeContent: item.NoticeContent,
        }
      });
    },
    // 处理日期
    handleDate(date){
      let a = date; 
      let c = a.split(' ');
      a=c[0];
      return a;
    },
    getData(){
      let params={
        currentPage: 1,
        pageSize: 10,
        ptype: this.dataForm.ptype,
      }
      this.api.getpolicys(params).then(res => {
        console.log(params);
        let {code, message, data} = res;
        if(['200', 200].includes(code) && res.success == true) {
          console.log(data);
          this.dataList = data;
        }
        else {
            this.$message({
                type: "info",
                message: message
            })
        }
      }).catch(err => {
          this.$message({
              type: "info",
              message: err
          })
      })
    }
  },
  created() {
    // console.log(this.dataForm);
    this.getData();
  },
}
</script>


<style scoped>
.main{
  width: 100%;
  border: none;
}
.clearfix{
  display: flex;
  align-items: flex-end;
}
.tittle{
  font-size: 22px;
  display: flex;
  justify-content: flex-start;
  font-weight: 600;
}
.more{
  display: flex;
  justify-content: flex-end;
}
.el-card /deep/ .el-card__header {
  padding: 12px;;
  border-bottom: 2px solid skyblue;
}
.el-card /deep/ .el-card__body {
  padding: 12px;
  min-height: 300px;
}
.item{
  display: flex;
  margin: 12px;
  justify-content: space-between;
}
.linkcontent{
  font-size: 18px;
  /* 控制字符串长度 */
  width: 72%;
  white-space: nowrap;
  overflow: hidden;
  justify-content: flex-start;
}
.spancontent{
  font-size: 16px;
  color: grey;
}
</style>